<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="layout :: common_header(~{::title})">
    <title>拣货单详情 - WMS仓库管理系统</title>
</head>
<body th:replace="layout :: common_body(~{::div.layui-body})">

<div class="layui-body" style="padding:15px;top: 0px;">
<style>
    .update {
        display: inline-block;
        margin-left: 15px;
        padding: 0 20px;
        height: 40px;
        line-height: 40px;
        font-size: 14px;
        background: #009789;
        color: #fff;
        text-align: center;
        border-radius: 3px;
        cursor: pointer;
    }

    .update i {
        display: inline-block;
        margin-right: 10px;
        vertical-align: middle;
        width: 30px;
        height: 30px;
        background: url();
    }
</style>
    <!-- start sp-wrapper -->
    <link rel="stylesheet" href="/sb/stock.css"/>
    <div class="sp-wrapper">
        <h2 class="sp-title"><span th:text="${sjcd}"></span></h2>
        <div class="sp-tool">
                <b>总共：&nbsp;[[${totalSize}]]&nbsp;条记录</b>
        </div>
        <div class="sp-table">
            <table>
                <thead>
                <tr>

                    <th>序号</th>
                    <th>订单号</th>
                    <th>订单明细ID</th>
                    <th>商品</th>
                    <th>规格</th>
                    <th>SKU</th>
                    <th>出库数量</th>
                    <th>出库仓位</th>
                    <th>出库时间</th>
                    <th>状态</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>
                <tr th:each="item:${list}">

                    <td th:text="${itemStat.index + 1}"></td>
                    <td th:text="${item.orderNum}"></td>
                    <td th:text="${item.sourceOrderItemId}"></td>

                    <td >
                        <img th:src="${item.colorImage}" style="height: 50px;width: 50px;" />
                    </td>
                    <td>
                        <p th:text="${item.colorValue }"></p>
                        <p th:text="${item.sizeValue }"></p>
                    </td>
                    <td th:text="${item.specNum}"></td>
                    <td th:text="${item.quantity}">

                    </td>
                    <td th:text="${item.locationName}">

                    </td>
                    <td >
                        <p th:text="${#dates.format(item.completeTime*1000, 'yyyy-MM-dd HH:mm:ss')}"
                           th:if="${item.completeTime > 0}"></p>
                    </td>
                    <td th:text="${T(com.b2c.entity.erp.enums.StockOutFormStatusEnum).getName(item.status)}"></td>
                    <td>
                        <a th:if="${item.status == 1}" class="cancel_pick" th:attr="data-id=${item.id}">取消拣货</a>
                    </td>
                </tr>

                </tbody>
            </table>
            <div class="pages">

            </div>
        </div>
    </div>
    <script type="text/javascript" src="/sb/jquery.min.js"></script>
    <script>
        layui.use(['laydate', 'layer'], function () {
            var laydate = layui.laydate;
            var layer = layui.layer;

            $(".cancel_pick").click(function () {
                var stockOutFormId = $(this).attr("data-id");

                if (confirm("您要取消该商品拣货会导致同订单的商品全部取消，确认要取消吗？")) {
                    $.ajax({
                        url: "/ajax_fahuo/picking_goods_cancel",
                        type: "POST",
                        dataType: "json",
                        contentType: "application/json",
                        data: JSON.stringify({id: stockOutFormId}),
                        success: function (res) {
                            if (res.code == 0) {
                                layer.msg("取消成功");
                                window.location.reload();
                            } else {
                                alert(res.msg);
                            }
                        },
                        complete: function (XMLHttpRequest) {
                            if (XMLHttpRequest.getResponseHeader("REDIRECT") == "NO_ACCESS") alert("无权限访问");
                        },
                    });
                }
            });
        })

    </script>
</div>
</body>
<html>